<template>
	<view>
	<view class="cell-box" v-for="(item, index) in clients" :key="index">
	    <view class="weui-cell" @click="onClientSelected" :data-index="index">
	        <view class="weui-cell__bd">
	            <view>
	                <text style="font-weight: bold">{{ item.name }}</text>
	            </view>
	            <view>
	                <text :class="'sext' + item.sex">{{ item.sex == 1 ? '男' : '女' }}</text>
	                <text style="margin-left: 10rpx">{{ item.age }}周岁</text>
	                <text style="margin-left: 10rpx">{{ item.mobile }}</text>
	            </view>
	        </view>
	        <view class="weui-cell__ft">
	            <text v-if="act == 'select'" style="
	                display: inline-block;
	                padding: 15rpx 30rpx;
	                border: 1rpx solid #0bb584;
	                color: #0bb584;
	                font-weight: bold;
	                border-radius: 10rpx;
	                font-size: 28rpx;
	                overflow: hidden;
	            ">
	                选择
	            </text>
	            <text v-else @click="removeClient" :data-id="item.id" style="
	                display: inline-block;
	                padding: 15rpx 30rpx;
	                border: 1rpx solid #eeeeee;
	                color: #f13e6d;
	                border-radius: 10rpx;
	                font-size: 28rpx;
	                overflow: hidden;
	            ">
	                移除
	            </text>
	        </view>
	    </view>
	</view>
	</view>
</template>

<script setup>
	import {
		reactive,
		ref,
		computed,
		toRaw,defineProps
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	const app = getApp()
	const act=ref('')
	const clients =ref([])
	onLoad((options)=>{
		console.log(options, 'options')
		act.value=options.act
		if(options.act=='select'){
			uni.setNavigationBarTitle({
				title:'请选择服务对象'
			})
		}else{
			uni.setNavigationBarTitle({
				title:'服务对象管理'
			})
		}
		app.globalData.utils.request({
			url:"/User/clients",
			success :res =>{
				console.log(res,'结果')
				clients.value=res.data.clients
				
			}
		})
	})
	const onClientSelected=(e)=>{
		console.log(e,'服务人员')
		if(act=='')return
		const index=e.currentTarget.dataset.index
		const clientsData=clients.value[index]
		//触发全局的自定义事件
		uni.$emit('clientChange',toRaw(clientsData))
		uni.navigateBack()
		
	}
	const removeClient=()=>{
		
	}
</script>

<style>
	   @import 'index.css'    
</style>
